<script lang="ts" setup>
const search = defineModel<string>();
const emit = defineEmits(["handleSearch"]);

watch(search, () => {
  handleSearch();
});
const handleSearch = () => {
  emit("handleSearch");
};
</script>

<template>
  <q-input
    dense
    v-model="search"
    :debounce="500"
    :placeholder="$t('pub.placeholder')"
  >
    <template v-slot:append>
      <q-icon
        name="search"
        @click="handleSearch"
        class="cursor-pointer"
      />
    </template>
  </q-input>
</template>

<style scoped></style>
